<template>
  <div>
    <Card :bordered="false" dis-hover class="ivu-mt pt10">
      <Form ref="formValidate" :model="formValidate" :label-width="labelWidth" :label-position="labelPosition">
        <Row type="flex" :gutter="24">
          <!-- <Col>
            <FormItem label="Category：" label-for="cate_id">
              <el-cascader
                  placeholder="Please select product category"
                  style="width:250px"
                  size="mini"
                  v-model="formValidate.cate_id"
                  :options="data"
                  :props="props"
                  @change="search"
                  filterable
                  clearable
              >
              </el-cascader>
            </FormItem>
          </Col> -->
		  <Col>
			  <FormItem label-for="store_name">
			    <Input enter-button style="width:300px"  :placeholder="$t('page.product.input_product_search')" v-model="formValidate.store_name" />
			  </FormItem>
		    <!-- <FormItem label="SKU：" prop="SKU">
				<Select
				 v-model="formValidate.sku"
				 clearable
				 @on-change="search"
				 style="width:200px;"
				>
					<Option
						v-for="item in skuList"
						:value="item.value"
						:key="item.value"
					>{{ item.label }}</Option>
				</Select>
		    </FormItem> -->
		  </Col>
		  <Col>
		    <FormItem prop="stock">
				<Select
				 v-model="formValidate.stock"
				 clearable
				 @on-change="search"
				 style="width:200px;"
				>
					<Option
						v-for="item in stockList"
						:value="item.value"
						:key="item.value"
					>{{ item.label }}</Option>
				</Select>

		    </FormItem>
		  </Col>
          <!-- <Col>
            <FormItem label="Brand：" prop="brand_id">
              <Cascader
                  :data="brandData"
                  placeholder="Please select the product brand"
                  change-on-select
                  v-model="formValidate.brand_id"
                  filterable
                  class="input-add"
                  @on-change="search"
              ></Cascader>
            </FormItem>
          </Col> -->
<!--          <Col>-->
<!--            <FormItem label="商品标签：" prop="store_label_id" class="labelClass">-->
<!--              <div class="acea-row row-middle">-->
<!--                <div class="labelInput acea-row row-between-wrapper" @click="openGoodsLabel">-->
<!--                  <div style="width: 90%;">-->
<!--                    <div v-if="storeDataLabel.length">-->
<!--                      <Tag closable v-for="(item,index) in storeDataLabel" :key="index" @on-close="closeStoreLabel(item)">{{item.label_name}}</Tag>-->
<!--                    </div>-->
<!--                    <span class="span" v-else>选择商品标签</span>-->
<!--                  </div>-->
<!--                  <div class="iconfont iconxiayi"></div>-->
<!--                </div>-->
<!--              </div>-->
<!--            </FormItem>-->
<!--          </Col>-->
		  <!-- <Col>
		    <FormItem label="Product：" label-for="store_name">
		      <Input enter-button style="width:300px"  placeholder="请输入商品名称,关键字,ID" v-model="formValidate.store_name" />
		    </FormItem>
		  </Col> -->
		  <Col>
			  <Button type="primary" @click="search" icon="md-search"></Button>
		    <!-- <div class="search" @click="search"  icon="md-search"></div> -->
		  </Col>
		 <!-- <Col>
		    <div class="reset" @click="reset">Reset</div>
		  </Col> -->
		</Row>
      </Form>
    </Card>
    <Card :bordered="false" dis-hover class="mt15 tablebox">
      <div class="product_tabs tabbox">
        <Tabs v-model="formValidate.type" @on-click="onClickTab">
          <TabPane v-for="(item, index) in headerListType" :key="index" :label="item.name + '(' + item.count + ')'"
                   :name="item.type.toString()" />
        </Tabs>
      </div>
      <div class="table mt20">
        <!--<div class="reset mb15" @click="setStock">同步库存</div>-->
        <router-link :to="roterPre+'/product/edit_product'">
          <Button type="primary" class="bnt">{{$t('page.product.add_product')}}</Button
          ></router-link>
<!--        <Tooltip-->
<!--            content="本页至少选中一项"-->
<!--            :disabled="!!checkUidList.length && isAll==0"-->
<!--        >-->
<!--          <Button-->
<!--              class="bnt ml15"-->
<!--              :disabled="!checkUidList.length && isAll==0"-->
<!--              @click="onDismount"-->
<!--              v-show="formValidate.type === '1'"-->
<!--          >批量下架</Button-->
<!--          >-->
<!--        </Tooltip>-->
<!--        <Tooltip-->
<!--            content="本页至少选中一项"-->
<!--            :disabled="!!checkUidList.length && isAll==0"-->
<!--        >-->
<!--          <Button-->
<!--              class="bnt ml15"-->
<!--              :disabled="!checkUidList.length && isAll==0"-->
<!--              @click="onShelves"-->
<!--              v-show="formValidate.type === '2'"-->
<!--          >批量上架</Button-->
<!--          >-->
<!--        </Tooltip>-->
<!--        <Tooltip-->
<!--            content="本页至少选中一项"-->
<!--            :disabled="!!checkUidList.length && isAll==0"-->
<!--        >-->
<!--          <Button-->
<!--              class="bnt ml15"-->
<!--              :disabled="!checkUidList.length && isAll==0"-->
<!--              @click="openBatch"-->
<!--          >批量设置</Button-->
<!--          >-->
<!--        </Tooltip>-->
        <vxe-table
            border="inner"
            ref="xTable"
            class="mt25"
            :loading="loading"
            row-id="id"
			max-height="550"
            :checkbox-config="{reserve: true}"
            :data="orderList">
          <template #empty>
            <p class="empty-text">{{$t('page.product.no_data')}}</p>
          </template>
         <!-- <vxe-column type="checkbox" width="100">
            <template #header>
              <div>
                <Dropdown transfer @on-click="allPages">
                  <a href="javascript:void(0)" class="acea-row row-middle">
                    <span>Select All({{isAll==1?(total-checkUidList.length):checkUidList.length}})</span>
                    <Icon type="ios-arrow-down"></Icon>
                  </a>
                  <template #list>
                    <DropdownMenu>
                      <DropdownItem name="0">current page</DropdownItem>
                      <DropdownItem name="1">all pages</DropdownItem>
                    </DropdownMenu>
                  </template>
                </Dropdown>
              </div>
            </template>
          </vxe-column> -->
          <!-- <vxe-column field="id" title="Id" width="70"></vxe-column> -->
          <vxe-column field="image" :title="$t('page.product.image')" width="100">
            <template v-slot="{ row }">
              <viewer>
                <div class="tabBox_img">
                  <img v-lazy="row.image" />
                </div>
              </viewer>
            </template>
          </vxe-column>
          <vxe-column field="store_name" :title="$t('page.product.product_name')" min-width="250">
            <template v-slot="{ row }">
              <Tooltip
			      :transfer="true"
                  theme="dark"
                  max-width="300"
                  :delay="600"
                  :content="row.store_name"
              >
                <div class="line2">{{ row.store_name }}</div>
              </Tooltip>
            </template>
          </vxe-column>
		  <vxe-column field="price" :title="$t('page.product.wholesale_price')" min-width="120"></vxe-column>
          
		  <vxe-column field="stock" :title="$t('page.product.avaliable')" min-width="120"></vxe-column>
          <vxe-column field="sort" :title="$t('page.product.sorting')" min-width="70"></vxe-column>
          <vxe-column field="state" :title="$t('page.product.status')" width="120">
            <template v-slot="{ row }">
				<div v-if="row.is_verify != 2">
					<i-switch v-model="row.is_show" :value="row.is_show" :true-value="1" :false-value="0" :disabled="row.is_verify == 1? false:true"
					          @on-change="changeSwitch(row)" size="large" v-if="formValidate.type != 7">
					  <span slot="open">On</span>
					  <span slot="close">Off</span>
					</i-switch>
				</div>
				<div v-else>
					<i-switch v-model="row.is_show" :value="row.is_show" :true-value="1" :false-value="0" :disabled="row.is_verify == 2? false:true"
					          @on-change="changeSwitchDraft(row)" size="large" v-if="formValidate.type != 7">
					  <span slot="open">{{$t('page.product.on')}}</span>
					  <span slot="close">{{$t('page.product.off')}}</span>
					</i-switch>
				</div>
			  
              <div v-else>{{ row.is_del ? 'Deleted' : !row.is_show ? 'Removed' : '' }}</div>
            </template>
          </vxe-column>
          <vxe-column field="refusal" :title="$t('page.product.reject_reason')" min-width="150" v-if="formValidate.type == -1"></vxe-column>
          <!-- <vxe-column field="refusal" title="Reason For Delisting" min-width="150" v-if="formValidate.type == -2"></vxe-column> -->
          <vxe-column field="action" :title="$t('page.product.operate')" align="center" width="250" fixed="right">
            <template #default="{ row, rowIndex }">
              <a @click="edit(row)" v-if="row.pid == 0 && formValidate.type != 1  && formValidate.type != 0">{{$t('page.product.edit')}}</a>
              <Divider type="vertical" v-if="row.pid == 0 && formValidate.type != 1  && formValidate.type != 0" />
			  
              <a @click="detail(row.id)">{{$t('page.product.details')}}</a>
              <Divider type="vertical"  v-if="row.pid == 0"/>
			  
			  <!-- <a @click="detail(row.id)" v-if="row.pid == 0 && formValidate.type == 0">{{$t('page.product.audit')}}</a> --><!--提交审核-->
			  <!-- <Divider type="vertical" v-if="row.pid == 0 && formValidate.type == 0"/> -->
			  
			  <a @click="pending(row.id)"  v-if="row.pid == 0 && formValidate.type == 3">{{$t('page.product.pending')}}</a><!--提交待审核-->
			  <Divider type="vertical" v-if="row.pid == 0 && formValidate.type == 3" />
				
			  <a @click="changeMenu(row, '3', rowIndex)" v-if="row.pid == 0 && formValidate.type != 1 && formValidate.type != 0">{{$t('page.product.remove')}}</a>

              <!-- <template>
                <Dropdown
                    @on-click="changeMenu(row, "3", rowIndex)"
                    :transfer="true"
                >
                  <a href="javascript:void(0)" class="acea-row row-middle">
                    <span>more</span>
                    <Icon type="ios-arrow-down"></Icon>
                  </a>
                  <DropdownMenu slot="list">
                   <DropdownItem name="1">查看评论</DropdownItem>
                   <DropdownItem name="2" v-if="!openErp">库存管理</DropdownItem>
                    <DropdownItem name="3" v-if="row.pid == 0">{{row.is_del ? 'restore' : 'delete' }}</DropdownItem>
                   <DropdownItem name="4">复制</DropdownItem>
                  </DropdownMenu>
                </Dropdown>
              </template> -->
<!--             <a @click="reply(row.id)">查看评论</a>-->
<!--             <Divider type="vertical" v-if="!openErp" />-->
				<!-- <a @click="stockControl(row)" v-if="!openErp">库存管理</a> -->
				<!-- <a @click="attrPriceControl(row)">规格管理</a> -->
<!--             <Divider type="vertical" v-if="row.pid == 0" />-->
<!--             <a @click="del(row,rowIndex)" v-if="row.pid == 0">{{row.is_del ? '恢复' : '删除' }}</a>-->
<!--             <Divider type="vertical" />-->
<!--             <a @click="copy(row)">复制</a>-->
            </template>
          </vxe-column>
        </vxe-table>
        <div class="acea-row row-right page">
          <Page
              :total="total"
              :current="formValidate.page"
              @on-change="pageChange"
              :page-size="formValidate.limit"
          />
        </div>
      </div>
    </Card>
<!--    <stockEdit ref="stock" @stockChange="stockChange"></stockEdit>-->
<!--	  <attrPriceEdit ref="attrPrice" @attrPriceChange="attrPriceChange"></attrPriceEdit>-->
    <productDetails :visible.sync="detailsVisible" :product-id="productId" @saved="getList"></productDetails>
<!--    <batchSet ref="batch" :checkUidList="checkUidList" :isAll="isAll" :formValidate="formValidate"></batchSet>-->
    <Modal
        v-model="storeLabelShow"
        scrollable
        title="Select product label"
        :closable="true"
        width="540"
        :footer-hide="true"
        :mask-closable="false"
    >
      <labelList ref="storeLabel" @activeData="activeStoreData" @close="storeLabelClose"></labelList>
    </Modal>
  </div>
</template>

<script>
import Setting from "@/setting";
import { mapState } from "vuex";
import goodsDetail from "../components/goodsDetail.vue";
import stockEdit from "../components/stockEdit.vue";
import attrPriceEdit from "../components/attrPriceEdit.vue";
import productDetails from '../components/productDetails.vue';
import batchSet from '../components/batchSet.vue';
import labelList from "@/components/labelList";

import {
  productListInfo,
  productHeaderInfo,
  cascaderList,
  setShowApi,
  productShowApi,
  productUnshowApi,
  brandList,
  skuList,
  setShowDraftApi,
  pendingApi
} from "@/api/product.js";
import { erpConfig } from "@/api/erp";
export default {
  name: "index",
  components: {
    goodsDetail,
    stockEdit,
    productDetails,
    batchSet,
    labelList,
	attrPriceEdit
  },
  data() {
    return {
      roterPre:Setting.roterPre,
	  props: { emitPath: false, multiple: true, checkStrictly: true },
      openErp:false,
      goodsId: "",
      data: [],
      headerList: [],
      total: 0,
      loading: false,
	  skuList:[],
      orderList: [],
	  stockList:[{
		  value:"All",
		  label:$t('page.product.all'),
	  },{
		  value:"In Stock",
		  label:"In Stock",
	  }],
	  showStockEditor: false, // 控制弹窗显示的状态
      formValidate: {
        store_label_id: [],
        brand_id: [],
        store_name: "",
		sku:"",
        cate_id: [],
		stock:"All",
        type: "1",
        page: 1,
        limit: 15,
      },
      // datanew: [],
      // dataid: [],
      product_status:1,
      detailsVisible: false,
      productId: 0,
      isAll: 0,
      isCheckBox: false,
      checkUidList:[],
      isLabel:0,
      brandData:[],
      storeLabelShow:false,
      storeDataLabel:[],
    };
  },
  watch: {
    $route() {
      if (this.$route.fullPath === `${this.roterPre}/product/index?type=5`) {
        this.getPath();
      }
    },
  },
  computed: {
    ...mapState("store/layout", ["isMobile"]),
    labelWidth() {
      return this.isMobile ? undefined : 80;
    },
    labelPosition() {
      return this.isMobile ? "top" : "right";
    },
	headerListType(){
	  var pending,active,request_decline,draft,request_pending = 0
	  for (let i = 0; i < this.headerList.length; i++) {
	    if (this.headerList[i].type == 1) {
	      active = this.headerList[i].count
	    }else if (this.headerList[i].type == 2) {
	      pending = this.headerList[i].count
	    }else if (this.headerList[i].type == 3) {
	      draft = this.headerList[i].count
	    }else if (this.headerList[i].type == -1) {
	      request_decline = this.headerList[i].count
	    }else if (this.headerList[i].type == 0) {
	      request_pending = this.headerList[i].count
	    }
	  }
	  
	  return [
		{type: 1, name: $t('page.product.active'), count: active},
	    {type: 2, name: $t('page.product.request_approved'), count: pending},
	    {type: -1, name: $t('page.product.request_decline'), count: request_decline},
	    {type: 0, name: $t('page.product.request_pending'), count: request_pending},
	    {type: 3, name: $t('page.product.draft'), count: draft}
	  ]
	},
  },
  mounted() {
    // this.goodsCategory();
    this.getHeader();
    // this.getErpConfig();
    // this.getBrandList();
	this.getSkuList();
  },
  methods: {
    // 标签弹窗关闭
    storeLabelClose() {
      this.storeLabelShow = false;
    },
    getLabelId(){
      let storeActiveIds = [];
      this.storeDataLabel.forEach((item)=>{
        storeActiveIds.push(item.id)
      });
      this.formValidate.store_label_id = storeActiveIds;
      this.search();
    },
    activeStoreData(storeDataLabel){
      this.storeLabelShow = false;
      this.storeDataLabel = storeDataLabel;
      this.getLabelId();
    },
    closeStoreLabel(label){
      let index = this.storeDataLabel.indexOf(this.storeDataLabel.filter(d=>d.id == label.id)[0]);
      this.storeDataLabel.splice(index,1);
      this.getLabelId();
    },
    openGoodsLabel(row){
      this.storeLabelShow = true;
      this.$refs.storeLabel.userLabel(JSON.parse(JSON.stringify(this.storeDataLabel)));
    },
    // 品牌列表
    getBrandList(){
      brandList().then(res=>{
        this.brandData = res.data
      }).catch(err=>{
        this.$Message.error(err.msg);
      })
    },
    changeMenu(row, name, index){
      switch (name) {
        case "1":
          this.reply(row.id);
          break;
        case "2":
          this.stockControl(row);
          break;
        case "3":
          this.del(row,index);
          break;
        case "4":
          this.copy(row);
          break;
      }
    },
    //批量设置
    openBatch() {
      this.isLabel = 0;
      this.$refs.batch.checkUidList = this.checkUidList;
      this.$refs.batch.isAll = this.isAll;
      this.$refs.batch.formValidate = this.formValidate;
      this.$refs.batch.batchModal = true;
    },
    checkboxItem(e){
      let id = parseInt(e.rowid);
      let index = this.checkUidList.indexOf(id);
      if(index !== -1){
        this.checkUidList = this.checkUidList.filter((item)=> item !== id);
      }else{
        this.checkUidList.push(id);
      }
    },
    checkboxAll(){
      // 获取选中当前值
      let obj2 = this.$refs.xTable.getCheckboxRecords(true);
      // 获取之前选中值
      let obj = this.$refs.xTable.getCheckboxReserveRecords(true);
	  if(this.isAll == 0 && this.checkUidList.length <= obj.length && !this.isCheckBox){
	  	obj = [];
	  }
      obj = obj.concat(obj2);
      let ids = [];
      obj.forEach((item)=>{
        ids.push(parseInt(item.id))
      })
      this.checkUidList = ids;
      if(!obj2.length){
        this.isCheckBox = false;
      }
    },
    allPages(e){
      this.isAll = e;
      if(e==0){
        this.$refs.xTable.toggleAllCheckboxRow();
        // this.checkboxAll();
      }else{
        if(!this.isCheckBox){
          this.$refs.xTable.setAllCheckboxRow(true);
          this.isCheckBox = true;
          this.isAll = 1;
        }else{
          this.$refs.xTable.setAllCheckboxRow(false);
          this.isCheckBox = false;
          this.isAll = 0;
        }
        this.checkUidList = []
      }
    },
    allReset(){
      this.isAll = 0;
      this.isCheckBox = false;
      this.$refs.xTable.setAllCheckboxRow(false);
      this.checkUidList = [];
    },
    // 批量上架
    onShelves() {
      if (this.isAll != 1 && this.checkUidList.length === 0) {
        this.$Message.warning("请选择要上架的商品");
      } else {
        let data = {
          all: this.isAll,
          ids: this.checkUidList
        };
        if (this.isAll == 1) {
          data.where = {
            cate_id: this.formValidate.cate_id,
			brand_id: this.formValidate.brand_id,
			store_label_id: this.formValidate.store_label_id,
            store_name: this.formValidate.store_name,
            type: this.formValidate.type,
          };
        }
        productShowApi(data)
            .then((res) => {
              this.$Message.success(res.msg);
              this.getHeader();
              this.allReset();
            })
            .catch((res) => {
              this.$Message.error(res.msg);
            });
      }
    },
    // 批量下架
    onDismount() {
      if (this.isAll != 1 && this.checkUidList.length === 0) {
        this.$Message.warning("请选择要下架的商品");
      } else {
        let data = {
          all: this.isAll,
          ids:this.checkUidList
        };
        if (this.isAll == 1) {
          data.where = {
            cate_id: this.formValidate.cate_id,
			brand_id: this.formValidate.brand_id,
			store_label_id: this.formValidate.store_label_id,
            store_name: this.formValidate.store_name,
            type: this.formValidate.type,
          };
        }
        productUnshowApi(data)
            .then((res) => {
              this.$Message.success(res.msg);
              this.getHeader();
              this.allReset();
            })
            .catch((res) => {
              this.$Message.error(res.msg);
            });
      }
    },
    //erp配置
    getErpConfig(){
      erpConfig().then(res=>{
        this.openErp = res.data.open_erp;
        this.product_status = res.data.product_status;
      }).catch(err=>{
        this.$Message.error(err.msg);
      })
    },
    stockChange(stock) {
		alert("stock_aaaa")
      this.orderList.forEach((item) => {
        if (this.goodsId == item.id) {
          item.branch_stock = stock;
        }
      });
    },
    // 库存管理
    stockControl(row) {
      this.goodsId = row.id;
      this.$refs.stock.modals = true;
      this.$refs.stock.productAttrs(row);
    },
	// 库存管理
	attrPriceControl(row) {
	  this.goodsId = row.id;
	  this.$refs.attrPrice.modals = true;
	  this.$refs.attrPrice.productAttrs(row);
	},
    //跳转刷新
    getPath() {
      this.formValidate.page = 1;
      this.formValidate.type = this.$route.query.type.toString();
      this.getList();
    },
    // 上下架
    changeSwitch(row) {
		  let info = '';
		  let title = "";
		  if(row.is_show == 1){
			  info = $t('page.product.confirmPublish')
			  title = $t('page.product.publishTitle')
		  }else{
			  info = $t('page.product.confirmUnpublish')
			  title = $t('page.product.unpublishTitle')
		  }

		  this.$Modal.confirm({
		        title: title,
		        content: info,
		        okText: this.$t('common.confirm'),
		        cancelText: this.$t('common.cancel'),
		        onOk: async () => {
		          setShowApi(row.id, row.is_show)
		              .then((res) => {
		                this.$Message.success($t('page.product.update_success'));
		                this.getHeader();
		                this.allReset();
		              })
		              .catch((res) => {
		                this.$Message.error($t('page.product.update_failed'));
		              });
		        },
		        onCancel: () => {
					this.getHeader();
					this.allReset();
		        }
		      });
    },
	changeSwitchDraft(row) {
      setShowDraftApi(row.id, row.is_show)
          .then((res) => {
            this.$Message.success(res.msg);
            this.getHeader();
            this.allReset();
          })
          .catch((res) => {
            this.$Message.error(res.msg);
          });
    },
    //获取列表
    getList() {
      this.loading = true;
	  console.log("sku",this.formValidate.sku)
      productListInfo(this.formValidate).then((res) => {
        this.orderList = res.data.list;
        this.total = res.data.count;
        this.loading = false;
        this.$nextTick(function(){
          if (this.isAll == 1) {
            if(this.isCheckBox){
              this.$refs.xTable.setAllCheckboxRow(true);
            }else{
              this.$refs.xTable.setAllCheckboxRow(false);
            }
          }else{
			let obj = this.$refs.xTable.getCheckboxReserveRecords(true);
			if(!this.checkUidList.length || this.checkUidList.length <= obj.length){
			  this.$refs.xTable.setAllCheckboxRow(false);
			}
          }
        })
      }).catch((err)=>{
        this.loading = false;
        this.$Message.error(err.msg);
      })
    },
	getSkuList() {
	  skuList(this.formValidate).then((res) => {
		  this.skuList = res.data.list;
	    // this.orderList = res.data.list;
	    // this.total = res.data.count;
	  }).catch((err)=>{
	    // this.loading = false;
	    this.$Message.error(err.msg);
	  })
	},
    //头部列表
    getHeader() {
      this.loading = true;
      productHeaderInfo(this.formValidate).then((res) => {
        this.headerList = res.data.list;
        if (this.$route.fullPath === `${Setting.roterPre}/product/index?type=5`) {
          this.getPath();
        } else {
          this.getList();
        }
      });
    },
    // 商品分类；
    goodsCategory() {
      cascaderList(1)
          .then((res) => {
            this.data = res.data;
          })
          .catch((res) => {
            this.$Message.error(res.msg);
          });
    },
    //详情
    detail(id) {
      // this.goodsId = id;
      // this.isProductBox = true;
      this.detailsVisible = true;
      this.productId = id;
    },
    // 编辑
    edit(row) {
      this.$router.push({ path: Setting.roterPre+"/product/edit_product/" + row.id });
    },
    // 编辑
    reply(id) {
      this.$router.push({ path: Setting.roterPre+'/product/product_reply?id=' + id });
    },
    // 删除
    del(row,num) {
      let delfromData = {
        // title: row.is_del ? '恢复商品' : '移入回收站',
		title: $t('page.product.delete_product_title'),
        num: num,
        url: `product/del/${row.id}`,
        method: "DELETE",
        ids: "",
		info:$t('page.product.remove_product_confirm'),
        tips:  row.is_del ? '确定恢复商品吗' : '确定移入回收站吗',
      };
      this.$modalSure(delfromData)
          .then((res) => {
            this.$Message.success(res.msg);
            this.orderList.splice(num, 1);
            this.getHeader();
          })
          .catch((res) => {
            this.$Message.error(res.msg);
          });
    },
	// 支持多种可能的错误消息格式
	formatValidationError(errorMsg) {
	  if (!errorMsg) return this.$t('errors.unknown');
	
	  // 拆分字段（支持逗号分隔）
	  const fieldKeys = errorMsg.split(',').map(item => item.trim());
	
	  // 翻译每个字段名（若无翻译则保留原 key）
	  const translatedFields = fieldKeys.map(key => 
	    this.$t(`page.msg.${key}`) || key
	  );
	
	  // 统一拼接“不能为空”
	  return `${translatedFields.join(', ')} ${this.$t('page.msg.not_null')}`;
	},
	//草稿提交待审核
	pending(id) {
	  pendingApi(id).then(res=>{
		// this.$Message.success($t('page.msg.'+res.msg));
		this.$Message.success(res.msg);
		this.getList();
      }).catch(err=>{
		 //  console.log("123213",message)
		 // let message = this.formatValidationError(err.msg);
		 //     this.$Message.error(message);
        this.$Message.error(err.msg)
      })
	},
    // 复制
    copy(row) {
      this.$router.push({ path: `${Setting.roterPre}/product/edit_product/`, query: { copy: row.id } });
    },
    //搜索
    search() {
      this.allReset();
      this.formValidate.page = 1;
      this.getHeader();
    },
    //重置
    reset() {
      this.formValidate.page = 1;
	  this.formValidate.store_label_id = [];
	  this.formValidate.brand_id = [];
      this.formValidate.store_name = "";
      this.formValidate.cate_id = [];
	  this.formValidate.type = "1";
	  this.storeDataLabel = [];
      this.getHeader();
    },
    //切换头部列表
    onClickTab(e) {
      this.allReset();
      this.formValidate.type = e;
      this.formValidate.page = 1;
	  this.getHeader();
      this.getList();
    },
    //分页
    pageChange(page) {
      this.formValidate.page = page;
      this.getList();
    },
  },
};
</script>

<style scoped lang="less">
/deep/.el-cascader {
	.el-input__inner {
	  min-height: 32px !important;
	}
	.el-input{
		.el-icon-arrow-down{
			font-size: 12px;
			color: #000;
		}
	}
	.el-cascader__search-input{
		margin-left: 7px !important;
		font-size: 12px;
	}
}
.labelInput{
  border: 1px solid #dcdee2;
  width :250px;
  padding: 0 5px;
  border-radius: 5px;
  min-height: 30px;
  cursor: pointer;
  .span{
    color: #c5c8ce;
	font-size: 12px;
  }
  .iconxiayi{
    font-size: 12px
  }
}
.labelClass{
  /deep/.ivu-form-item-content{
    line-height: unset;
  }
}
/deep/.ivu-form-label-left .ivu-form-item-label {
  text-align: right;
}

/deep/.ivu-page-header,
/deep/.ivu-tabs-bar {
  margin-bottom: 0px !important;
  border-bottom: 1px solid #E9E9E9;
}

/deep/.ivu-card-body {
  padding: 14px 20px 10px 20px !important;
}


/deep/.ivu-tabs-nav {
  height: 45px;
}

.bg {
  z-index: 100;
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5);
}

.tabbox {
  padding: 0px 20px 0px;
  // border-bottom: 1px solid #DCDFE6;
}

.box {
  padding: 20px;
  padding-bottom: 0px;
}

.tablebox {
  margin-top: 15px;
}

.btnbox {
  padding: 20px 0px 0px 30px;

  .btns {
    width: 99px;
    height: 32px;
    background: #1890ff;
    border-radius: 4px;
    text-align: center;
    line-height: 32px;
    color: #ffffff;
    cursor: pointer;
  }
}

.table {
  padding: 0px 30px 15px 30px;
}
.ivu-table {
  background-color: #182328;
  color: #fff;
}
.tabBox_img {
  width: 36px;
  height: 36px;
  border-radius: 4px;
  cursor: pointer;

  img {
    width: 100%;
    height: 100%;
  }
}

.search {
  width: 86px;
  height: 32px;
  background: #1890ff;
  border-radius: 4px;
  text-align: center;
  line-height: 32px;
  font-size: 13px;
  font-family: PingFangSC-Regular, PingFang SC;
  font-weight: 400;
  color: #ffffff;
  cursor: pointer;
}

.reset {
  width: 86px;
  height: 32px;
  border-radius: 4px;
  border: 1px solid rgba(151, 151, 151, 0.36);
  text-align: center;
  line-height: 32px;
  font-size: 13px;
  font-family: PingFangSC-Regular, PingFang SC;
  font-weight: 400;
  font-weight: 500;
  color: #515a6e;
  // background: #2D8CF0;

  cursor: pointer;
}
</style>